<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>layout Layui</title>
    <link rel="stylesheet" href="../static/layui_tree_grid/design/css/layui.css">
    <script src="../static/layui_tree_grid/design/layui.js"></script>
</head>

<body class="layui-layout-body">
    <table class="layui-hidden" id="treeTable" lay-filter="treeTable"></table>
    <script>
        layui.use(['element', 'layer', 'form', 'upload', 'treeGrid'], function () {
            var treeGrid = layui.treeGrid; //很重要
            var datatalbe = [{
                "sd_add_time": "2018-02-25 17:00:07",
                "sd_code": "1",
                "sd_id": "a8fd51263f854a3582f6cb1ced3f9e99",
                "sd_idalls": "a8fd51263f854a3582f6cb1ced3f9e99",
                "sd_idallvalue": "测试集团",
                "sd_name": "测试集团",
                "sd_sort": 1,
                "sd_type": "2",
                "sd_up_id": 0,
                "sd_use": 1
            }, {
                "sd_add_time": "2018-03-13 08:54:31",
                "sd_code": null,
                "sd_id": "008EF28299814AA5AB4639EB6D1B4789",
                "sd_idalls": null,
                "sd_idallvalue": null,
                "sd_name": "测试班组44",
                "sd_sort": null,
                "sd_type": null,
                "sd_up_id": "a8fd51263f854a3582f6cb1ced3f9e99",
                "sd_use": 1
            }];
            var treeTable = treeGrid.render({
                elem: '#treeTable'
                // ,url:'data.json'
                , data: datatalbe
                , cellMinWidth: 100
                , treeId: 'sd_id'//树形id字段名称
                , treeUpId: 'sd_up_id'//树形父id字段名称
                , treeShowName: 'sd_name'//以树形式显示的字段
                , cols: [[
                    { type: 'checkbox' }
                    , { field: 'sd_name', edit: 'text', width: '400', title: '水果' }
                    , { field: 'sd_id', edit: 'text', width: '300', title: 'id' }
                    , { field: 'sd_up_id', edit: 'text', width: '300', title: 'pId' }
                ]]
                , page: false
            });
        });
    </script>
</body>

</html>